<template>
  <!-- 用户代理123充 -->
  <div class="app-container">
    <div class="app-wrap">
      <search-table ref="table" :table-loading="listLoading" :table-data="dataList" @query="getDataList(true)" @reset="refresh">
        <template v-slot:row>
          <el-form-item label="日期时间:" label-width="80px">
            <el-date-picker is-range v-model="listQuery.dateTime" type="datetimerange" range-separator="至" start-placeholder="开始日期" 
            end-placeholder="结束日期" class="full-width-input time-box" :default-time="['00:00:00', '23:59:59']" clearable></el-date-picker>
          </el-form-item>
          <el-form-item label="注册时间:" label-width="80px">
            <el-date-picker is-range v-model="listQuery.registerTime" type="datetimerange" range-separator="至" start-placeholder="开始日期" 
            end-placeholder="结束日期" class="full-width-input time-box" :default-time="['00:00:00', '23:59:59']" clearable></el-date-picker>
          </el-form-item>
          <el-form-item label="登录时间:" label-width="80px">
            <el-date-picker is-range v-model="listQuery.loginTime" type="datetimerange" range-separator="至" start-placeholder="开始日期" 
            end-placeholder="结束日期" class="full-width-input time-box" :default-time="['00:00:00', '23:59:59']" clearable></el-date-picker>
          </el-form-item>
          <el-form-item class="marginR20">
            <el-select v-model="listQuery.filter_user_type" filterable placeholder="请选择查询类型">
              <el-option :label="item.label" :value="item.value" v-for="(item, index) in conditionData" :key="index"></el-option>
            </el-select>
            <el-input type="text" class="width200" v-model="listQuery.filter_value" clearable placeholder="请输入数值"/>
          </el-form-item>
          <el-form-item label="渠道:" label-width="50px">
            <el-select v-model="listQuery.agent_id" placeholder="请选择渠道" filterable >
              <el-option label="全部" value=""></el-option>
              <el-option :label="'【'+item.value+'】'+item.label" :value="item.value" v-for="(item, index) in channelData" :key="index"></el-option>
            </el-select>
          </el-form-item>
        </template>
        <template v-slot:actions>
          <el-button type="info" size="mini" icon="el-icon-refresh" @click="getDataList">刷新</el-button>
        </template>
        <template>
          <el-table-column align="center" prop="id" label="用户ID" width="120" />
          <el-table-column align="center" prop="nick_name" label="用户昵称" show-overflow-tooltip/>
          <el-table-column prop="agent_id" label="渠道名" align="center" width="200" show-overflow-tooltip>
            <template slot-scope="scope">
              <span v-show="scope.row.agent_id">【{{scope.row.agent_id}}】{{ $public.channelLabel(scope.row.agent_id) }}</span>
            </template>
          </el-table-column>
          <el-table-column align="center" prop="parent_id" label="上级ID" />
          <el-table-column align="center" prop="team_num" label="代理人数"/>
          <el-table-column align="center" prop="team_one_pay_num" label="首充人数"/>
          <el-table-column align="center" prop="team_two_pay_num" label="二充人数"/>
          <el-table-column align="center" prop="team_three_pay_num" label="三充人数"/>
        </template>
        <template v-slot:footer>
          <pagination :total="currentTotal" :page.sync="listQuery.page" :limit.sync="listQuery.size" @pagination="getDataList" />
        </template>
      </search-table>
    </div>
  </div>
</template>

<script>
import { throttle } from "@/utils/index";
import { 
  getAgent123
 } from "@/api/agent";
import SearchTable from "@/components/SearchTable";
export default {
  name: "agent123",
  components: {
    SearchTable,
  },
  data () {
    return {
      channelData:this.$store.state.commonState.channelDataArray,
      conditionData:[
        {label:'用户ID',value:1},
        {label:'上级ID',value:2}
      ],
      checkedItem: null,
      listLoading: false,
      isShowDetails: false,
      currentTotal: 0,
      listQuery: {
        page: 1,
        size: 50,
        filter_user_type:1,
        filter_value:'',
        agent_id:'',
        dateTime: [this.$public.getDateWeek('s',0)+' 00:00:00',this.$public.getDateWeek('e',0)+' 23:59:59'],
        start_time: '',
        end_time: '',
        registerTime: [],
        register_time_start: '',
        register_time_end: '',
        loginTime: [],
        login_time_start: '',
        login_time_end: '',
      },
      dataList: [],
    };
  },
  created () {
    // this.getDataList()
  },
  activated(){
    this.channelData=this.$store.state.commonState.channelDataArray
    this.getDataList()
  },
  methods: {
    // 用户代理123充
    async getDataList (query) {
      let that = this,params=that.listQuery;
      if(query && !query.page){
        params.page=1
        params.size=50
      }
      that.dataList = [];
      that.checkedItem = null;
      that.listLoading = true;
      if (params.dateTime && params.dateTime[0] && params.dateTime[1]) {
        params.start_time = that.$public.standardDate(params.dateTime[0])
        params.end_time = that.$public.standardDate(params.dateTime[1])
      }else{
        params.start_time = ''
        params.end_time = ''
      }
      if (params.registerTime && params.registerTime[0] && params.registerTime[1]) {
        params.register_time_start = that.$public.standardDate(params.registerTime[0])
        params.register_time_end = that.$public.standardDate(params.registerTime[1])
      }else{
        params.register_time_start = ''
        params.register_time_end = ''
      }
      if (params.loginTime && params.loginTime[0] && params.loginTime[1]) {
        params.login_time_start = that.$public.standardDate(params.loginTime[0])
        params.login_time_end = that.$public.standardDate(params.loginTime[1])
      }else{
        params.login_time_start = ''
        params.login_time_end = ''
      }
      const response = await getAgent123(params)
      if(response.code==1){
        if (response.data.list) {
          that.currentTotal = response.data.total;
          that.dataList = response.data.list;
        }
      }else{
        that.$message.error(response.msg)
      }
      that.listLoading = false;
    },
    // 刷新
    refresh: throttle(function () {
      this.listQuery = {
        page: 1,
        size: 50,
        filter_user_type:1,
        filter_value:'',
        agent_id:'',
        dateTime: [this.$public.getDateWeek('s',0)+' 00:00:00',this.$public.getDateWeek('e',0)+' 23:59:59'],
        start_time: '',
        end_time: '',
        registerTime: [],
        register_time_start: '',
        register_time_end: '',
        loginTime: [],
        login_time_start: '',
        login_time_end: '',
      };
      this.getDataList();
    }, 2000),
  },
};
</script>

<style lang="scss" scoped></style>
